<template>
  <router-link class="swiper_notice" to="/notice/list">
    <b-carousel
      id="carousel-1"
      v-model="slide"
      :interval="4000"
      img-height="200"
      background="#F8F8F8"
    >
      <b-carousel-slide v-for="(o, i) in list" :key="i">
        <template #img>
          <p style="text-align: center" class="mb-0">
            {{ o[vm.title] }}
          </p>
        </template>
      </b-carousel-slide>
    </b-carousel>
  </router-link>
</template>


<script>
export default {
  props: {
    list: {
      type: Array,
      default: function () {
        return [];
      },
    },
    vm: {
      type: Object,
      default: function () {
        return {
          img: "img",
          title: "title",
        };
      },
    },
  },
  data() {
    return {
      slide: 0,
      sliding: null,
    };
  },
  methods: {
    onSlideStart(slide) {
      this.sliding = true;
    },
    onSlideEnd(slide) {
      this.sliding = false;
    },
  },
};
</script>


<style scoped>
</style>
